.z-form {
    line-height: 20px;
    input[type=number],
    input[type=search],
    input[type=text],
    input[type=password],
    input[type=datetime],
    input[type=datetime-local],
    input[type=date],
    input[type=month],
    input[type=time],
    input[type=week],
    input[type=email],
    input[type=url],
    input[type=tel],
    input[type=color],
    input[disabled],
    select {
        width: 100%;
        padding: 4px $pa-f;
        background: #fff;
        height: $com-h;
        color: $form-c;
        border-radius: $form-radius; // -webkit-appearance: none;
    }
    input[disabled] {
        background-color: $disabled;
        border-color: $disabled-bor;
        color: $disabled-c;
        cursor: not-allowed;
    }
    textarea {
        height: 100px;
        width: 100%;
        padding: 4px $pa-f;
        background: #fff;
    }
    .label {
        margin-right: $pa-f;
        display: inline-block;
        margin-left: $pa-f;
        &:first-child {
            margin-left: 0;
        }
    }
    .form-inline {
        display: inline-block;
        margin-right: $pa-f;
        margin-bottom: $pa;
        input,
        textarea,
        select {
            width: inherit;
        }
    }
    .form-group {}
    .form-row {
        display: block;
        margin-bottom: $pa;
        input,
        textarea,
        select {
            width: 275px;
        }
        input[type='radio'],
        input[type='checkbox'] {
            width: initial;
        }
    }
    .form-flex {
        display: flex;
        margin-bottom: $pa;
        align-items: baseline;
        .body {
            flex: 1;
        }
    }
    .form-column {
        margin-bottom: $pa;
        .label {
            margin-bottom: $pa-f;
            display: inline-block;
        }
        .body {
            display: block;
        }
    }
    .label-row {
        display: flex;
        label {
            flex: 1;
            margin-right: -1px;
            display: block;
        }
    }
    .address-three {
        display: flex;
        select {
            flex: 1;
            display: block;
            width: 33.3%;
            margin-right: 7px;
            &:last-child {
                margin-right: 0;
            }
        }
    } // .checkbox,
    // .radio {
    //     // margin-bottom: $pa;
    //     vertical-align: middle;
    //     display: block;
    //     position: relative;
    //     input[type=checkbox],
    //     input[type=radio] {
    //         margin-right: 5px;
    //         position: absolute;
    //         left: 0;
    //         top: 50%;
    //         transform: translate(0, -50%);
    //     }
    //     .inline {
    //         vertical-align: middle;
    //         display: inline-block;
    //         margin-right: $pa-f;
    //         position: relative;
    //         padding-left: 18px;
    //     }
    //     .text {
    //         padding-left: $pa;
    //     }
    // }
    // .none {
    //     display: none;
    // }
}

.form-msg {
    color: $red;
    margin-bottom: $pa;
    display: none;
}

// .align-right {
//     .label {
//         min-width: 56px;
//         text-align: right;
//     }
//     .form-inline {
//         margin-right: 0;
//     }
// }
.animation {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

input[type='radio'],
input[type='checkbox'],
select {
    vertical-align: middle;
}